<template name="Message">
  <div class="message {{#if pinAt}}pin{{/if}} {{#if archived}}fold{{/if}}">
    <div class="message-header clearfix">
      {{> PinMessageInfo}}
      <div class="message-header-avatar">
        {{#LinkToCardModal user=user}}
          {{> avatar user=user shape="circle" class="img-circle" size="medium"}}
        {{/LinkToCardModal}}
      </div>
      <div class="message-header-title">
        {{> MessageActions}}
        {{> MessageHeaderInfo}}
        <div class="meta-info text-muted small">
          {{> EmailInfo this}}
          {{#if updateUserId}}
            {{_ "message_edit_by_and_when" user=updateUser.name time=(formatDayWithTime updatedAt)}}
          {{/if}}
        </div>
        <div class="summary text-ellipsis text-muted">{{{localizedSummary}}}</div>
      </div>
    </div>
    {{#unless archived}}
      {{> MessageContent}}
    {{/unless}}
  </div>
</template>

<template name="MessageHeaderInfo">
  <span class="message-header-name">{{userName}}</span>
  <span class="text-muted small">
    {{formatDayWithTime createdAt}}
    {{#if showInternal}}<i class="fa fa-lock" data-toggle="tooltip" title="{{_ 'message_internal'}}"></i>{{/if}}
  </span>
</template>

<template name="MessageContent">
  <div class="message-content {{#if isNew}}animated flash{{/if}}">
    {{> Template.dynamic template=contentTemplate data=templateData}}

    {{#with parent}}
      {{> QuotedMessage}}
    {{/with}}

    {{> MessageFiles}}
  </div>
</template>

<template name="TextContent">
  {{#with message}}
    <div class="markdown">{{#markdown}}{{{content}}}{{/markdown}}</div>
  {{/with}}
</template>

<template name="ImageContent">
  {{#with message}}
    <div class="markdown">{{#markdown}}{{{content}}}{{/markdown}}</div>
    {{#with image}}
      {{#if isGif}}
        <a href="{{fileURL this}}" data-fancybox="thread" data-caption="{{summary}}">
          <img src="{{fileURL this}}" alt="{{name}}" class="img-responsive img-thumbnail"/>
        </a>
      {{else}}
        <a href="{{fileURL this 'preview'}}" data-fancybox="thread" data-caption="{{summary}}">
          <img src="{{fileURL this 'thumbnail'}}" alt="{{name}}" class="img-responsive img-thumbnail"/>
        </a>
      {{/if}}
    {{/with}}
  {{/with}}
</template>

<template name="MessageFiles">
  {{#if files.count}}
    <div class="files">
      <span href="#" class="files-count" data-toggle="collapse" data-target="#files-list-{{_id}}" aria-expanded="true">
        {{_ 'files_with_count' count=files.count}} <span class="collapse-arrow"><i class="fa fa-caret-down"></i></span>
      </span>
      <ul class="files nav nav-pills nav-stacked collapse in" id="files-list-{{_id}}" aria-expanded="true">
        {{#each files}}
          <li>
            {{{fileicon type}}} {{name}} <span class="text-muted">({{filesize size}})</span>
            <div class="actions pull-right">
              {{> FileViewLink}}
              {{> FileDownloadLink}}
            </div>
          </li>
        {{/each}}
      </ul>
    </div>
  {{/if}}
</template>

<template name="MessageActions">
  <div class="btn-group message-actions pull-right">
    {{#unless compare contentType '===' 'log'}}
      {{#if canRevoke}}
        <button type="button" class="btn btn-sm btn-default btn-revoke" data-toggle="tooltip" title="{{_ 'message_action_revoke'}}">
          <i class="fa fa-undo"></i>
        </button>
      {{/if}}
      {{> EditMessageButton}}
      {{> PinMessageButton}}
      {{#if threadCanReply thread}}
        <button type="button" class="btn btn-sm btn-default btn-reply" data-toggle="tooltip" title="{{_ 'message_action_reply'}}">
          <i class="fa fa-reply"></i>
        </button>
      {{/if}}
      <button type="button" class="btn btn-sm btn-default btn-forward" data-toggle="tooltip" title="{{_ 'message_action_forward'}}">
        <i class="fa fa-mail-forward"></i>
      </button>
      {{#if compare contentType '===' 'text'}}
        <button type="button" class="btn btn-sm btn-default btn-copy" data-toggle="tooltip" title="{{_ 'message_action_copy'}}">
          <i class="fa fa-copy"></i>
        </button>
      {{/if}}
    {{/unless}}
  </div>
</template>

<template name="MessageForwardPreviewModal">
  <div class="modal fade modal-rounded" id="MessageForwardPreviewModal">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">&times;</button>
          <h4 class="modal-title">{{_ "message_forward_to"}}</h4>
        </div>
        <div class="modal-body" style="padding-top: 0; padding-bottom: 0;">
          <ul class="list-group threads simple">
            <li class="list-group-item clearfix thread">
              {{#with thread}}
                {{> Template.dynamic template=(threadListTemplate this 'simple')}}
              {{/with}}
            </li>
            <a href="#" id="btn-view-message" class="list-group-item thread message">
              {{message.localizedSummary}}
            </a>
          </ul>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal" aria-label="Close">{{_ 'app_action_discard'}}</button>
          <button type="button" class="btn btn-primary" id="btn-forward-message">{{_ "app_action_send"}}</button>
        </div>
      </div>
    </div>
  </div>
</template>

<template name="MessageModal">
  <div class="modal fade full-screen no-footer message">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close" id="btn-close-SelectThreadModal">&times;</button>
          <h4 class="modal-title">{{_ "message_view"}}</h4>
        </div>
        <div class="modal-body scroll-box">
          <div class="message-content">
            {{#if compare contentType '===' 'html'}}
              {{> EmailContent message=this modal=".modal.message"}}
            {{else}}
              <div class="markdown">{{#markdown}}{{{content}}}{{/markdown}}</div>
              {{#if compare contentType '===' 'image'}}
                <a href="{{fileURL image 'original'}}" data-fancybox="thread" data-caption="{{summary}}">
                  <img src="{{fileURL image 'thumbnail'}}" alt="{{image.name}}" class="img-responsive img-thumbnail"/>
                </a>
              {{/if}}
            {{/if}}

            {{> MessageFiles}}
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<template name="QuotedMessage">
  <div class="quoted-message">
    <blockquote>
      <div class="title">
        <a href="#content-{{_id}}" data-toggle="collapse">
          {{formatDayWithTime createdAt}}, {{user.name}}:
        </a>
      </div>
      <div class="collapse in" id="content-{{_id}}">
        {{localizedSummary}}
      </div>
    </blockquote>
  </div>
</template>
